<template>
	<div>
		<el-breadcrumb separator-class="el-icon-arrow-right">
		  	<el-breadcrumb-item :to="{ path: '/admin' }">首页</el-breadcrumb-item>
		  	<el-breadcrumb-item>权限模块</el-breadcrumb-item>
		</el-breadcrumb>
		<el-form ref="form" :model="formData" label-width="80px">
		  	<el-form-item label="账号">
		    	<el-input v-model="formData.username" disabled></el-input>
		  	</el-form-item>
		  	<el-form-item label="设备码">
		    	<el-input v-model="formData.device_id" disabled></el-input>
		  	</el-form-item>
		  	<el-form-item label="Ip">
		    	<el-input v-model="formData.ip" disabled></el-input>
		  	</el-form-item>

  		<el-form-item label="设备来源">
    	  <el-select v-model="formData.platfrom" disabled>
            <el-option label="电脑" :value="1"></el-option>
            <el-option label="手机" :value="2"></el-option>
            <el-option label="Ipod" :value="3"></el-option>
          </el-select>
     	</el-form-item> 

		 <el-form-item label="权限模块">
		    <el-checkbox-group v-model="formData.list">
		     	 <el-checkbox v-for="(item,index) in module"  v-model="item.type" :label="item.id" :key="item.type">{{item.name}}</el-checkbox>
		    </el-checkbox-group>
		  </el-form-item>
		  
		  <el-form-item label="模块按钮">
		  		<el-form-item v-for="(bitem,index) in button" :label="index" :key="index" label-width="120px">
		  			 <el-checkbox-group v-model="formData.blist">
		  				<el-checkbox v-for="(bbitem,index) in bitem" v-model="index" :label="index" :key="index">{{bbitem}}</el-checkbox>
				     </el-checkbox-group>  
				</el-form-item >    
		  </el-form-item>
		  
		  	<!--<el-form-item label="是否启用">
		    	<el-switch v-model="formData.status"></el-switch>
		  	</el-form-item> -->

		  	<el-form-item>
		    	<el-button type="primary" @click="addUser">开通</el-button>
		    	<el-button>取消</el-button>
		  	</el-form-item>
		</el-form>
	</div>
</template>

<script type="text/javascript">
	export default{
		data(){
			return{
				formData:{
					username:"",
					platfrom:1,
					list:[],	
					blist:[],			
				},
				module:[],	
				button:[],
				bbutton:{},
				bitem:[],
			}
		},
		created(){
			this.formData._token = window.axios.defaults.headers.common['X-CSRF-TOKEN'];
			this.getUser();
			this.getModule();
			this.getButton();
		},
		methods:{
		  getUser(){
	    	axios.get("/admin/moduleadd?id="+this.$route.query.id +'&platfrom=' +this.$route.query.platfrom+'&username=' +this.$route.query.username)
	    		.then(res => {
	    			var data = res.data.result;
	    			if(res.data.code == 200){
	    				this.formData.id = data.id;
	    				this.formData.username = data.username;
	    				//this.formData.password = data.password;
	    				this.formData.platfrom = data.platfrom;
	    				this.formData.device_id = data.device_id;
	    				this.formData.ip = data.ip;
	    				this.formData.level = data.level;
						let a = data.list.map((item) =>{
						 	return item = parseInt(item);
						});
	    				this.formData.list = a;
	    				this.formData.blist = data.blist;
	    			}
	    		})
		    }, 
		    getModule(){
				axios.get('/admin/getmodule').then(result => {
					this.module = result.data.result;
				});
		    
		    },
		    getButton(){
				axios.get('/admin/getbutton').then(result => {
					this.button = result.data.result;
				});
		    
		    },
			handleRemove(file, fileList) {
		        console.log(file, fileList);
		    },
		    handlePreview(file) {
		        console.log(file);
		   	},
		    handlePictureCardPreview(file) {
		        this.dialogImageUrl = file.url;
		        this.dialogVisible = true;
		    },
		    handleExceed(files, fileList) {
	        	this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
	      	},
		    beforeRemove(file, fileList) {
		        return this.$confirm(`确定移除 ${ file.name }？`);
		    },
		    addUser(){
		    	axios.post('/admin/moduleedit',this.formData)
		    		.then(result => {
		    			if(result.data.code == 200){
		    				this.$notify({
		    					type:"success",
		    					message:result.data.message
		    				})
		    			}else{
		    				this.$notify.error(result.data.message);
		    			}
		    		})
		    		.catch(error => {

		    		})
		    }
		}
	}
</script>

<style type="text/css">
	input[type=file] {
	    display: none;
	}
</style>